import React, { lazy } from "react";
import { createBrowserRouter, createHashRouter, redirect } from "react-router-dom";
import { UserOutlined } from "@ant-design/icons";
import App from "../App";
const Data = lazy(() => import("../Page/data"));
const Child1=lazy(()=>import('../Page/data1/Child1'))
const Data1=lazy(()=>import('../Page/data1'))
type routesType = {
  path: string;
  element: JSX.Element;
  children?: routesType;
  icon?: any;
  label?: string;
}[];

export const menuRoutes: routesType = [
  {
    label: "数据页",
    path: "/data",
    icon: <UserOutlined />,
    element: <Data />,
  },
  {
    label: "数据页1",
    path: "/data1",
    element: <Data1></Data1>,
    children: [
      {
        label: "数据页1的子路由1",
        path: "/data1/child1",
        element: <Child1></Child1>,
        children: [
          {
            label: "数据页1的子路由1的子路由",
            path: "/data1/child1/sz1",
            element: <>数据页1的子路由1的子路由</>,
          },
        ],
      },
      {
        label: "数据页1的子路由2",
        path: "/data1/child2",
        element: <>数据页1的子路由2</>,
      },
      {
        label: "数据页1的子路由3",
        path: "/data1/child3",
        element: <>数据页1的子路由3</>,
      },
    ],
  },
  {
    label: "数据页2",
    path: "/data2",
    icon: <UserOutlined />,
    element: <Data />,
  },
  {
    label: "数据页3",
    path: "/data3",
    element: <Data1></Data1>,
  },
  {
    label: "数据页4",
    path: "/data4",
    icon: <UserOutlined />,
    element: <Data />,
  },
  {
    label: "数据页5",
    path: "/data5",
    element: <Data1></Data1>,
  },
];

const routes = [
  {
    path: "/",
    element: <App />,
    children: menuRoutes,
  },
  {
    path: "*",
    element: <>404</>,
  },
];

const router = createBrowserRouter(routes);

export default router;
